home *** CD-ROM | disk | FTP | other *** search
/ Nikkei Mac 20 / NIKKEI-MAC-CD-VOL-20-1998-12.ISO.7z / NIKKEI-MAC-CD-VOL-20-1998-12.ISO / オンラインソフト / 9.ウェブ作成ツール / PageSpinner / Pagespin-ext-pack-201j.sit / PageSpinner 2.01 Ext Pack r1 Jp / New Examples Folder / Examples / JavaScript / PopupMenu2 < prev    next >
Text File  |  1997-10-26  |  3KB  |  60 lines
  1. <HTML>
  2. <HEAD>
  3. <TITLE>ポップアップメニューその 2</TITLE>
  4. </HEAD>
  5.  
  6. <BODY BGCOLOR=FFFFFF TEXT=000000>
  7. <H1>JavaScript ポップアップメニューその2</H1>
  8.  
  9. <B>このページにはポップアップメニューがあり、ページやURLを選択できます。</B>
  10. <P>
  11. JavaScript は Netscape Navigator 2.0 以降と、Internet Explorer for MacOS 3.0.1 以降でのみ使用可能なことに注意してください。 <BR>
  12. <FONT COLOR="931B15">あなたの観客の全てが JavaScript 対応のブラウザを使用しているわけではありません。.</FONT>
  13. <HR>
  14. これは、他のページにリンクするポップアップメニューを作るのに JavaScript を使用するもうひとつの例です。この例では特に  "Go"ボタンが必要ありません。ポップアップメニューを選択すると即座にアクションが起こります。
  15. <P>
  16. <FORM>
  17. ページを選択 <SELECT NAME="menu" onChange="top.location.href = this.form.menu.options[this.form.menu.selectedIndex].value">
  18. <OPTION SELECTED VALUE="index.html">目次 
  19. <OPTION VALUE="groucho.html">Groucho 
  20. <OPTION VALUE="harpo.html">Harpo 
  21. <OPTION VALUE="chico.html">Chico 
  22. <OPTION VALUE="zeppo.html">Zeppo 
  23. </SELECT>
  24. </FORM> 
  25.  
  26. <HR>
  27. ノート：このページは、あなたのローカルディスクに保存されたものを  Internet Explorer を使ってロードしてもうまく表示されません。ウェブサーバーに保存されたものはうまく表示されます。 
  28. <HR>
  29. <B>>使い方</B>
  30. <BLOCKQUOTE>
  31. ポップアップメニューその２のソースは以下のようなものです：
  32. <P>
  33. <PRE><FORM>
  34. <SELECT NAME="menu" onChange="top.location.href =
  35.  this.form.menu.options[this.form.menu.selectedIndex].value">
  36. <OPTION SELECTED VALUE="index.html">目次 
  37. <OPTION VALUE="groucho.html">Groucho 
  38. <OPTION VALUE="harpo.html">Harpo 
  39. <OPTION VALUE="chico.html">Chico 
  40. <OPTION VALUE="zeppo.html">Zeppo 
  41. </SELECT>
  42. </FORM></PRE>
  43. <P>
  44. <CODE>OPTION</CODE> タグに含まれている行を編集して、リンクと表示されるテキスト変更してください。VALUE アトリビュートの中には、フルパスの URL を入れる事もできます。
  45. </BLOCKQUOTE>
  46. <HR>
  47. <P>
  48. <B>プログラム上の注意</B>
  49. <BLOCKQUOTE>
  50. 実際の JavaScript は選択リストの onChange ハンドラーの中にあります。JavaScript 配列 <CODE>this.form.menu.options</CODE> は、"menu"と名付けられたフォームにある、オプションタグ(とその内容)の配列です。どのメニュー項目が選択されているかを見つけるには、プロパティ<CODE>this.form.menu.selectedIndex</CODE>を使います。ここに、選択された項目のインデックスが保持されています。
  51. <P>
  52. それから、<CODE>this.form.menu.options[this.form.menu.selectedIndex].value</CODE>の式で配列の中から選択されている項目の属性値にアクセスしてページの名前を入手します。
  53. <P>
  54. <CODE>top.location.href</CODE> は、ウィンドウに表示される URL のアドレスです。我々は、<CODE>top.location</CODE>に新しいページの URLを含むようセットしているので、我々のページがフレームの中にあっても新しいページがウィンドウ全体に表示されます。
  55. <P>
  56. 特定のフレーム内に表示される内容を変更したい場合は、 <CODE>top</CODE> と共に <TT>top.frames.<I>name_of_the_frame</I></TT>を変更するとできます。例えば、フレーム定義ページにある "contact"という名前のフレームでは、フレームのソースを <CODE>top.frames.contact.location.href</CODE>のようにしてアクセスできます。
  57. </BLOCKQUOTE>
  58. </BODY>
  59. </HTML>
  60.